{extend name="$base" /}
{block name="resources"}
<script type="text/javascript" src="__STATIC__/My97DatePicker/WdatePicker.js"></script>
<style>
    .clearfix:after{
        display:block;
        content:'';
        height:0;
        clear:both;
    }
    .ns-main{margin-top:0;}
    .alert .mt5 .h30{font-size:12px;margin-top:10px;}
    .basic_data_ons{
        width: 100%;
        box-sizing: border-box;
        padding-bottom:10px;
    }
    .basic_data_ons .basic_data_ons_son_list{
        width: 100%;
        height: 84%;
    }
    .basic_data_ons .basic_data_ons_son_list li{
        width: 20%;
        height: 50%;
        float: left;
    }
    .basic_data_ons .basic_data_ons_son_list li .basic_data_ons_son_list_nvs{
        width:80%;
        height:80%;
        margin:0 auto;
        text-align:center;
    }
    .basic_data_ons .basic_data_ons_son_list li .basic_data_ons_son_list_nvs p{
        line-height:30px;
        font-size:12px;
        color:#5e6166;
        margin-top:40px;
        margin-bottom: 0;
    }
    .basic_data_ons .basic_data_ons_son_list li .basic_data_ons_son_list_nvs cite{
        line-height: 39px;
        font-size: 20px;
        color: #126AE4;
    }
    .mytable td{
        padding: 10px;
    }

    /* tab 样式 */
    .menu-tab{
        border-top:1px solid #F6F6F6;
        padding:10px 0px 10px;
    }

    .menu-tab ul li{
        float:left;
        padding:4px 10px;
        cursor:pointer;
    }
    .menu-tab ul li.on{
        background:grey;
        color:#fff;
    }
    .menu-tab ul li:hover{
        background:grey;
        color:#fff;
    }

    .data-box{
        display:none;
    }

    #commissionDistribution{
        display:block;
    }
</style>
{/block}
{block name="main"}
<div class="basic_data_ons clearfix">
    <ul class="basic_data_ons_son_list">
        <li>
            <div class="basic_data_ons_son_list_nvs">
                <p>我的余额</p>
                <cite>￥{$account_info.balance}</cite>
            </div>
        </li>
        <li>
            <div class="basic_data_ons_son_list_nvs">
                <p>赠送余额</p>
                <cite>￥{$account_info.give_balance}</cite>
            </div>
        </li>
        <li>
            <div class="basic_data_ons_son_list_nvs">
                <p>已确认奖励</p>
                <cite>￥{$account_info.commission_is_confirm}</cite>
            </div>
        </li>
        <li>
            <div class="basic_data_ons_son_list_nvs">
                <p>待确认奖励</p>
                <cite>￥{$account_info.commission_not_confirm}</cite>
            </div>
        </li>
    </ul>
</div>


<div class="menu-tab clearfix" id="menu_tab">
    <ul>
        <li data-tag="commissionDistribution" class="on" >分享奖励</li>
        <li data-tag="commissionRegionAgent">服务奖励</li>
        <li data-tag="withdrawRecords">提现记录</li>
        <li data-tag="accountRecords">消费记录</li>
    </ul>
</div>

<!-- 分享奖励 -->
<div class="data-box" id="commissionDistribution">
    <table class="mytable">
        <tr>
            <td width="10%" class="default-condition">
                <input type="text" name="startDate" placeholder="请选择开始日期" class="input-medium input-common middle" onclick="WdatePicker()"/>
                &nbsp;-&nbsp;
                <input type="text" name="endDate" placeholder="请选择结束日期" class="input-medium input-common middle" onclick="WdatePicker()" />
                <select class="select-common middle" name="is_issue">
                    <option value="0,1,2">请选择确认状态</option>
                    <option value="0,1">未确认</option>
                    <option value="2">已确认</option>
                </select>
                <button type="button" onclick="searchData()" value="搜索" class="btn-common">搜索</button>
            </td>
        </tr>
    </table>

    <table class="table-class" >
        <colgroup>
            <col style="width: 4%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
        </colgroup>
        <thead>
        <tr align="center">
            <th></th>
            <th>订单编号</th>
            <th>订单商品</th>
            <th>商品金额</th>
            <th>奖励金额</th>
            <th>状态</th>
            <th>创建时间</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

<div class="data-box" id="commissionRegionAgent">
    <table class="mytable">
        <tr>
            <td width="10%" class="default-condition">
                <input type="text" name="startDate" placeholder="请选择开始日期" class="input-medium input-common middle" onclick="WdatePicker()"/>
                &nbsp;-&nbsp;
                <input type="text" name="endDate" placeholder="请选择结束日期" class="input-medium input-common middle" onclick="WdatePicker()" />
                <select class="select-common middle" name="is_issue">
                    <option value="0,1,2">请选择确认状态</option>
                    <option value="0,1">未确认</option>
                    <option value="2">已确认</option>
                </select>
                <button type="button" onclick="searchData()" value="搜索" class="btn-common">搜索</button>
            </td>
        </tr>
    </table>
    <table class="table-class" >
        <colgroup>
            <col style="width: 4%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
            <col style="width: 16%;">
        </colgroup>
        <thead>
        <tr align="center">
            <th></th>
            <th>订单编号</th>
            <th>订单商品</th>
            <th>商品金额</th>
            <th>奖励金额</th>
            <th>状态</th>
            <th>创建时间</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

<div class="data-box" id="withdrawRecords">
    <table class="mytable">
        <tr>
            <td width="10%" class="default-condition">
                <input type="text" name="startDate" placeholder="请选择开始日期" class="input-medium input-common middle" onclick="WdatePicker()"/>
                &nbsp;-&nbsp;
                <input type="text" name="endDate" placeholder="请选择结束日期" class="input-medium input-common middle" onclick="WdatePicker()" />
                <select class="select-common middle" name="withdraw_status">
                    <option value="">请选择提现状态</option>
                    {volist name="withdraw_status" id="status"}
                    <option value="{$key}">{$status}</option>
                    {/volist}
                </select>
                <button type="button" onclick="searchData()" value="搜索" class="btn-common">搜索</button>
            </td>
        </tr>
    </table>
    <table class="table-class" >
        <colgroup>
            <col style="width: 2%;">
            <col style="width: 20%;">
            <col style="width: 20%;">
            <col style="width: 20%;">
            <col style="width: 18%;">
            <col style="width: 20%;">
        </colgroup>
        <thead>
        <tr align="center">
            <th align="center"></th>
            <th>提现编号</th>
            <th>提现账户</th>
            <th>提现金额</th>
            <th>提现状态</th>
            <th>提现时间</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

<div class="data-box" id="accountRecords">
    <table class="mytable">
        <tr>
            <td width="10%" class="default-condition">
                <input type="text" name="startDate" placeholder="请选择开始日期" class="input-medium input-common middle" onclick="WdatePicker()"/>
                &nbsp;-&nbsp;
                <input type="text" name="endDate" placeholder="请选择结束日期" class="input-medium input-common middle" onclick="WdatePicker()" />
                <select class="select-common middle" name="from_type">
                    <option value="">全部</option>
                    {volist name="from_type_list" id="val"}
                    <option value="{$val.type_id}">{$val.type_name}</option>
                    {/volist}
                </select>
                <button type="button" onclick="searchData()" value="搜索" class="btn-common">搜索</button>
            </td>
        </tr>
    </table>
    <table class="table-class" >
        <colgroup>
            <col style="width: 2%;">
            <col style="width: 20%;">
            <col style="width: 20%;">
            <col style="width: 20%;">
            <col style="width: 18%;">
            <col style="width: 20%;">
        </colgroup>
        <thead>
        <tr align="center">
            <th align="center"></th>
            <th>账户类型</th>
            <th>发生方式</th>
            <th>发生时间</th>
            <th>金额</th>
            <th align="left">备注</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
</div>

{/block}
{block name="script"}
<script type="text/javascript">

    function LoadingInfo(page_index) {
        //加载数据
        var current_tag = $("#menu_tab ul li.on").attr('data-tag');
        eval("("+ current_tag +"(" + page_index + "))");
    }

    /**
     * 分享奖励
     */
    function commissionDistribution(page_index)
    {
        var box = $("#commissionDistribution");
        var start_date = box.find("[name='startDate']").val();
        var end_date = box.find("[name='endDate']").val();
        var is_issue = box.find("[name='is_issue']").val();

        $.ajax({
            type : "post",
            url : "{:__url('AGENT_MAIN/account/commissionDistribution')}",
            data : {
                "page_index" : page_index,
                "page_size" : $("#showNumber").val(),
                "start_date" : start_date,
                "end_date" : end_date,
                "is_issue" : is_issue
            },
            success : function(data) {
                if (data["data"].length > 0) {
                    $("#commissionDistribution .table-class tbody").empty();
                    for (var i = 0; i < data["data"].length; i++) {
                        var html = '';
                        html += '<tr align="center">';
                            html += '<td></td>';
                            html += '<td>'+data["data"][i]["order_no"]+'</td>';
                            html += '<td>'+ data["data"][i]["goods_name"] + '</td>';
                            html += '<td align="center">'+ data["data"][i]["goods_money"] +'</td>';
                            html += '<td align="center">'+ data["data"][i]["commission_money"] +'</td>';
                            html += '<td>'+ data["data"][i]["issue_name"] + '</td>';
                            html += '<td align="center">'+ timeStampTurnTime(data["data"][i]["create_time"]) +'</td>';
                        html += '</tr>';
                        $("#commissionDistribution .table-class tbody").append(html);
                    }
                } else {
                    var html = '<tr align="center"><td colspan="7">暂无符合条件的数据记录</td></tr>';
                    $("#commissionDistribution .table-class tbody").html(html);
                }
                initPageData(data["page_count"],data['data'].length,data['total_count']);
                $("#pageNumber").html(pagenumShow(jumpNumber,$("#page_count").val(),{$pageshow}));
            }
        });
    }

    /**
     * 服务奖励
     */
    function commissionRegionAgent(page_index)
    {
        var box = $("#commissionRegionAgent");
        var start_date = box.find("[name='startDate']").val();
        var end_date = box.find("[name='endDate']").val();
        var is_issue = box.find("[name='is_issue']").val();
        $.ajax({
            type : "post",
            url : "{:__url('AGENT_MAIN/account/commissionRegionAgent')}",
            data : {
                "page_index" : page_index,
                "page_size" : $("#showNumber").val(),
                "start_date" : start_date,
                "end_date" : end_date,
                "is_issue" : is_issue
            },
            success : function(data) {
                if (data["data"].length > 0) {
                    $("#commissionRegionAgent .table-class tbody").empty();
                    for (var i = 0; i < data["data"].length; i++) {
                        var html = '';
                        html += '<tr align="center">';
                        html += '<td></td>';
                        html += '<td>'+data["data"][i]["order_no"]+'</td>';
                        html += '<td>'+ data["data"][i]["goods_name"] + '</td>';
                        html += '<td>'+ data["data"][i]["goods_money"] +'</td>';
                        html += '<td>'+ data["data"][i]["commission_money"] +'</td>';
                        html += '<td>'+ data["data"][i]["issue_name"] + '</td>';
                        html += '<td align="center">'+ timeStampTurnTime(data["data"][i]["create_time"]) +'</td>';
                        html += '</tr>';
                        $("#commissionRegionAgent .table-class tbody").append(html);
                    }
                } else {
                    var html = '<tr align="center"><td colspan="7">暂无符合条件的数据记录</td></tr>';
                    $("#commissionRegionAgent .table-class tbody").html(html);
                }
                initPageData(data["page_count"],data['data'].length,data['total_count']);
                $("#pageNumber").html(pagenumShow(jumpNumber,$("#page_count").val(),{$pageshow}));
            }
        });
    }

    /**
     * 提现记录
     */
    function withdrawRecords(page_index)
    {
        var box = $("#withdrawRecords");
        var start_date = box.find("[name='startDate']").val();
        var end_date = box.find("[name='endDate']").val();
        var withdraw_status = box.find("[name='withdraw_status']").val();

        $.ajax({
            type : "post",
            url : "{:__url('AGENT_MAIN/account/withdrawRecords')}",
            data : {
                "page_index" : page_index,
                "page_size" : $("#showNumber").val(),
                "start_date" : start_date,
                "end_date" : end_date,
                "withdraw_status" : withdraw_status
            },
            success : function(data) {
                if (data["data"].length > 0) {
                    $("#withdrawRecords .table-class tbody").empty();
                    for (var i = 0; i < data["data"].length; i++) {
                        var html = '';
                        html += '<tr align="center">';
                        html += '<td></td>';
                        html += '<td>'+data["data"][i]["withdraw_no"]+'</td>';
                        html += '<td>';
                            html += '<div>'+ data["data"][i]["bank_name"] +'</div>';
                            html += '<div>'+ data["data"][i]["account_number"] +'</div>';
                        html += '</td>';
                        html += '<td>'+ data["data"][i]["cash"] +'</td>';
                        html += '<td>'+ data["data"][i]["status_name"] +'</td>';
                        html += '<td>'+ timeStampTurnTime(data["data"][i]["ask_for_date"]) +'</td>';
                        html += '</tr>';
                        $("#withdrawRecords .table-class tbody").append(html);
                    }
                } else {
                    var html = '<tr align="center"><td colspan="6">暂无符合条件的数据记录</td></tr>';
                    $("#withdrawRecords .table-class tbody").html(html);
                }
                initPageData(data["page_count"],data['data'].length,data['total_count']);
                $("#pageNumber").html(pagenumShow(jumpNumber,$("#page_count").val(),{$pageshow}));
            }
        });
    }

    /**
     * 账户记录
     */
    function accountRecords(page_index)
    {
        var box = $("#accountRecords");
        var start_date = box.find("[name='startDate']").val();
        var end_date = box.find("[name='endDate']").val();
        var from_type = box.find("[name='from_type']").val();
        $.ajax({
            type : "post",
            url : "{:__url('AGENT_MAIN/account/accountRecords')}",
            data : {
                "page_index" : page_index,
                "page_size" : $("#showNumber").val(),
                "account_type" : "2,4",
                "start_date" : start_date,
                "end_date" : end_date,
                "from_type" : from_type
            },
            success : function(data) {
                if (data["data"].length > 0) {
                    $("#accountRecords .table-class tbody").empty();
                    for (var i = 0; i < data["data"].length; i++) {
                        var html = '';
                        html += '<tr align="center">';
                        html += '<td></td>';
                        html += '<td>'+data["data"][i]["account_type_name"]+'</td>';
                        html += '<td>'+ data["data"][i]["type_name"] + '</td>';
                        html += '<td>'+ timeStampTurnTime(data["data"][i]["create_time"]) +'</td>';
                        html += '<td>'+ data["data"][i]["number"] +'</td>';
                        html += '<td align="left">'+ data["data"][i]["text"] +'</td>';
                        html += '</tr>';
                        $("#accountRecords .table-class tbody").append(html);
                    }
                } else {
                    var html = '<tr align="center"><td colspan="6">暂无符合条件的数据记录</td></tr>';
                    $("#accountRecords .table-class tbody").html(html);
                }
                initPageData(data["page_count"],data['data'].length,data['total_count']);
                $("#pageNumber").html(pagenumShow(jumpNumber,$("#page_count").val(),{$pageshow}));
            }
        });
    }

    function searchData(){
        LoadingInfo(1);
    }

    //tab切换
    $("#menu_tab ul li").click(function(){
        if($("#menu_tab ul li.on").attr('data-tag') !== $(this).attr('data-tag')){
            $(this).addClass('on').siblings().removeClass('on');
            LoadingInfo(1);
            //显示切换
            var current_tag = $(this).attr('data-tag');
            $(".data-box").hide();
            $("#" + current_tag).show();
        }
    })
</script>
{/block}